<template>
  <div style="height: 6vh; background-color:#fff;padding: 10px 20px;">
    <span style="line-height: 60px;font-size: 20px;">评论管理</span>
  </div>
  <el-card style="margin: 20px; height: 70px">
    <el-form :inline="true">
      <el-form-item label="用户名">
        <el-input placeholder="请输入用户名" v-model="searchEvaluateForm.username" style="width: 200px"></el-input>
      </el-form-item>
      <el-form-item label="评价">
        <el-input placeholder="请输入关键字" v-model="searchEvaluateForm.content" style="width: 200px"></el-input>
      </el-form-item>
      <el-form-item label="星级">
        <el-select v-model="searchEvaluateForm.star" placeholder="请选择星级" style="width: 200px">
          <el-option label="1星" value="1"></el-option>
          <el-option label="2星" value="2"></el-option>
          <el-option label="3星" value="3"></el-option>
          <el-option label="4星" value="4"></el-option>
          <el-option label="5星" value="5"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-button @click="resetSearch">重置</el-button>
        <el-button type="primary" @keydown.enter="loadEvaluate" @click="loadEvaluate">查询</el-button>
      </el-form-item>
    </el-form>
  </el-card>
  <el-card style="margin: 20px">
    <el-table :data="EvaluateArr">
      <el-table-column prop="star" label="星级" align="center"></el-table-column>
      <el-table-column prop="username" label="用户名" align="center"></el-table-column>
      <el-table-column prop="phone" label="手机号" align="center"></el-table-column>
      <el-table-column prop="createTime" label="评论时间" align="center"></el-table-column>
      <el-table-column prop="content" label="评论内容" align="center"></el-table-column>
      <el-table-column label="操作" align="center">
        <template #default="scope">
          <el-button @click="editEvaluate(scope.row.id)" link type="primary" size="small">编辑</el-button>
        </template>
      </el-table-column>
    </el-table>
  </el-card>
</template>

<script setup>

import {onMounted, ref} from 'vue'
import {ElMessage, ElMessageBox} from 'element-plus'
import qs from 'qs';
import axios from "axios";

const dialogVisible = ref(false)


const editEvaluate = (id) => {
  dialogTitle.value = "修改评论"
  dialogVisible.value = !dialogVisible.value;
  axios.get(BASE_URL + '/v1/evaluate/select?id=' + id)
      .then((response) => {
        if (response.data.code == 2000){
          saveEvaluateForm.value = response.data.data[0]
          let level = parseInt(saveEvaluateForm.value.level)+10
          axios.get(BASE_URL+ '/v1/evaluate/select?level='+level)
              .then((response) => {
                if (response.data.code == 2000){
                  leaderOption.value = response.data.data
                }else {
                  ElMessage.error(response.data.msg)
                }
              })
        }else {
          ElMessage.error(response.data.msg)
        }
      })
}
const loadLeader = () =>{
}
const EvaluateArr = ref([]);
const searchEvaluateForm = ref({username:'',star:'',content:''})

const loadEvaluate = () => {
   let date = qs.stringify(searchEvaluateForm.value)
   axios.get(BASE_URL + '/v1/evaluate/select?' + date)
       .then((response) => {
         if (response.data.code == 2000){
           EvaluateArr.value = response.data.data
         }else {
           ElMessage.error(response.data.msg)
         }
       })
}
onMounted(() => {
  loadEvaluate()
})
const resetSearch = () => {
  searchEvaluateForm.value = {}
  loadEvaluate();
}
</script>

<style scoped>

</style>
